<template>
    <u-modal @confirm="onConfirm" @cancel="onVisibleChange(false)" :show="showModal" @close="onVisibleChange(false)" :showCancelButton="true"  title="选择操作类型" >
        <view class="slot-content" style="width: 100%;">
            <u-radio-group v-model="radioVal" placement="column" iconPlacement="right">
                <view class="" style="width: 100%;">
                    <u-radio
                        activeColor="#19be6b"
                        label="取消开台"
                        :name="1"
                        size="29"
                        iconSize="22"
                        labelSize="24"
                        :borderBottom="true"
                        :customStyle="{
                            width: '100%',
                            margin: '8rpx',
                            height: '42px'
                        }"
                    ></u-radio>
                </view>
                <view class="" style="width: 100%;">
                    <u-radio
                        activeColor="#19be6b"
                        label="了机"
                        :name="2"
                        size="29"
                        iconSize="22"
                        labelSize="24"
                        :borderBottom="true"
                        :customStyle="{
                            width: '100%',
                            margin: '8rpx',
                            height: '42px'
                        }"
                    ></u-radio>
                </view>
            </u-radio-group>
        </view>
    </u-modal>
</template>
<script>
    export default {
        props: {
            productTaskList: {
                type: Array,
                default() {
                    return [];
                }
            },
            modalState: {
                type: Boolean,
                default: false
            }
        },
        data() {
            return {
                radioVal: null,
                showModal: false
            };
        },
        methods: {
            onConfirm() {
                if (this.radioVal) {
                    this.$emit('confirm', this.radioVal);
                } else {
                    uni.showToast({
                        title: '请选择操作类型',
                        icon: 'error'
                    });
                }
            },
            onVisibleChange(e) {
                this.$emit('on-visible-change', e);
            }
        },
        watch: {
            modalState(newVal) {
                this.showModal = newVal;
                if (!newVal) {
                    this.radioVal = null;
                }
            }
        }
    }
</script>
